<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0,minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <title>预约订单 - 五四宪法历史资料陈列馆</title>
    <link rel="stylesheet" href="/static/css/style.css">
    <link rel="stylesheet" href="/static/layui/layui/css/layui.css"  media="all">
    <script src="/static/js/jquery.min.js"></script>
    <script src="/static/js/common.js"></script>
    <script src="/static/layui/layui/layui.all.js"></script>
</head>
<body>
<div class="main">
    <div class="top">
        <a class="back" href="javascript:history.back(-1)"><img src="/static/image/left.png" alt="">返回</a>
        预约订单
    </div>
        <form action="orderDetail" id="modifyOrder" method="post">
            <div class="order_info container">
                <div class="xyb" style="display:block;">
                    <div class="s-title tuan1" style="margin-top: 0.64rem;">参观场馆：</div>
                    <div class="select select_venue">
                        <a href="javascript:;" class="venue {if condition="'A' eq $list.venue"}on{/if}"  data-v="A" >
                        {if condition="'A' eq $list.venue"}
                            <img src="/static/pc/img/button.png" alt="">
                            {else/}
                            <img src="/static/pc/img/button1.png" alt="">
                        {/if}
                        北山街馆区</a>
                        <a href="javascript:;" class="venue {if condition=" 'B' eq $list.venue"}on{/if}" data-v="B">
                        {if condition="'B' eq $list.venue"}<img src="/static/pc/img/button.png" alt=""> {else/}
                        <img src="/static/pc/img/button1.png" alt="">
                        {/if}栖霞岭馆区</a>
                    </div>

                    <input class="guan"  name="venue" type="hidden" value="{$list.venue}">


                    <div class="cg_time">
                        <div class="s-title">参观日期：</div>
                        <div class="choose_date">
                            <input type="text" name="day"  id="dateBox" class="cday timeday"  value="{$list['day']}" >
                        </div>
                        <div class="choose_time">
                            <div class="s-title">可参观时间段：</div>
                            {if condition="$list.explain eq 1""}
                            <div class="isExplain">
                                <div class="timePart select">
                                    {if $list.dinner == 0}
                                        <a href="javascript:;" class="venue morning on">上午</a>
                                        <a href="javascript:;" class="venue afternoon">下午</a>
                                        {else/}
                                        <a href="javascript:;" class="venue morning ">上午</a>
                                        <a href="javascript:;" class="venue afternoon on">下午</a>
                                    {/if}
                                </div>

                                <div class="arriveTime select">
                                    <select name="" id="visithour_a">
                                        <option value="9" {if $list.arrival_time ==9}selected{/if}>9</option>
                                        <option value="10"{if $list.arrival_time ==10}selected{/if}>10</option>
                                        <option value="11"{if $list.arrival_time ==11}selected{/if}>11</option>
                                    </select>
                                    <span>时</span>
                                    <select name="" id="visitminute_a">
                                        {if $list.dinner == 0}
                                            <option value="00" {if $list.arrival_time1 ==00}selected{/if}>0</option>
                                            <option value="15" {if $list.arrival_time1 ==15}selected{/if}>15</option>
                                            <option value="30" {if $list.arrival_time1 ==30}selected{/if}>30</option>
                                            <option value="45" {if $list.arrival_time1 ==45}selected{/if}>45</option>
                                            {else/}
                                            <option value="00" >0</option>
                                            <option value="15">15</option>
                                            <option value="30" >30</option>
                                            <option value="45" >45</option>
                                        {/if}
                                    </select>
                                    <span>分</span>
                                    <br>
                                    <select name="" id="visithour_p">
                                        <option value="14" {if $list.arrival_time ==14}selected{/if}>14</option>
                                        <option value="15" {if $list.arrival_time ==15}selected{/if}>15</option>
                                        <option value="16" {if $list.arrival_time ==16}selected{/if}>16</option>
                                    </select>
                                    <span>时</span>
                                    <select name="" id="visitminute_p">
                                        {if $list.dinner == 1}
                                        <option value="00" {if $list.arrival_time1 ==00}selected{/if}>0</option>
                                        <option value="15" {if $list.arrival_time1 ==15}selected{/if}>15</option>
                                        <option value="30" {if $list.arrival_time1 ==30}selected{/if}>30</option>
                                        <option value="45" {if $list.arrival_time1 ==45}selected{/if}>45</option>
                                        {else/}
                                        <option value="00" >0</option>
                                        <option value="15">15</option>
                                        <option value="30" >30</option>
                                        <option value="45" >45</option>
                                        {/if}
                                    </select>
                                    <span>分</span>
                                    <input type="hidden" name="arrive" class="arrive">
                                    <input type="hidden" name="arrive_part" class="arrive_part">
                                </div>
                            </div>
                            {else/}
                                <!-- A馆-->
                                <div class="aguan">
                                    <div class="guan">A馆</div>
                                    {foreach $visit_time as $k=>$v}
                                    <p onclick="setValue({$k})" {if condition="$k eq $data.between_time"}class="select" {/if}>{$v}</p>
                                    {/foreach}
                                </div>

                                <div class="clear"></div>
                                <!-- B馆-->
                                <div class="bguan">
                                    <input type="text"  id="dateBox1" name="day1" class="bday timeday1" value="{$time[0]}" >
                                    <div class="guan">B馆</div>
                                    {foreach $visit_time as $k=>$v}
                                    <p onclick="setValue({$k})">{$v}</p>
                                    {/foreach}
                                </div>
                            {/if}
                            <div class="clear tuand" style="display: none;"></div>
                            <em class="tuand" style="display: none;">*目前场馆只提供整点讲解服务，请准时到达。</em>
                        </div>
                        <input type="hidden" id="between_time" name="time" title="时间" value="">
                    </div>
                    <input type="hidden" name="explain" class="explain1" value="{$list.explain}">
                    <input type="hidden" name="id" value="{$list.id}">
                    <input type="hidden" name="views" value="{$list.views}">
                    <a href="javascript:;" class="submit" onclick="checkParse()" >完成</a>
                </div>
            </div>
        </form>
</div>
<script>

    $("#between_time").val($(".aguan  .select").text());
    // var result = false;
    function checkParse(){
        // $('.xyb input').each(function(){
        //     if($(this).val() == ""){
        //         alert("请将信息填写完整后提交！");
        //         result = false;
        //         return false
        //     }else{
        //         result = true;
        //     }
        // })
        // if(result){
        if("{$list.explain}" == 1){
            if($('.morning').hasClass('on')){
                var hour = $('#visithour_a').val()
                var minute = $('#visitminute_a').val()
                $('input.arrive_part').val("上午");
                $('input.arrive').val(hour + ":" + minute);
            }
            if($('.afternoon').hasClass('on')){
                var hour = $('#visithour_p').val()
                var minute = $('#visitminute_p').val()
                $('input.arrive_part').val("下午");
                $('input.arrive').val(hour + ":" + minute);
            }
        }
        $('#modifyOrder').submit();
        // }else{
        //     return false
        // }
    }
</script>
<script>
    $("#between_time").val($(".aguan  .select").text());

    layui.use('laydate', function(){
        var laydate = layui.laydate;
        //执行一个laydate实例
        laydate.render({
            elem: '#dateBox', //指定元素
            ready: function() {
                $(".layui-laydate-content table tr td:nth-child(2)").addClass('laydate-disabled')
                $.ajax({
                    type: 'GET',
                    url: '/getDate',
                    success: function (result) {
                        var conNotV = result.conNotView;
                        var conV = result.canVIew;
                        var dataEm = $(".layui-laydate-content table tr td");
                        $.each(dataEm,function(key,item){
                            if(!($.inArray(item.getAttribute('lay-ymd'), conV) == -1)){
                                item.setAttribute('class','');
                            }
                            if(!($.inArray(item.getAttribute('lay-ymd'), conNotV) == -1)){
                                item.setAttribute('class','laydate-disabled');
                            }
                        })
                    },
                    error: function(result){
                    },
                });
                if($(".explain1").val() ==1 ){
                    $(".layui-laydate-content table tr td:nth-child(1)").addClass('laydate-disabled')
                    $(".layui-laydate-content table tr td:nth-child(7)").addClass('laydate-disabled')
                }
            },
            change: function() {
                $(".layui-laydate-content table tr td:nth-child(2)").addClass('laydate-disabled')
                if($(".explain1").val() ==1 ){
                    $(".layui-laydate-content table tr td:nth-child(7)").addClass('laydate-disabled')
                    $(".layui-laydate-content table tr td:nth-child(1)").addClass('laydate-disabled')
                }
            },
            done: function(value, date, endDate){
                $(".cday").val(value);
                // timeday();
                var venue =  $(".select_venue .on").attr("data-v");
                var day = $(".cday").val();
                var day1 = $(".bday").val();
                $.ajax({
                    type: 'POST',
                    url: 'runimformation',
                    data: {"day":day,"venue":venue,"day1":day1,'explain':$(".explain1").val()},
                    dataType:'json',
                    success: function (result) {
                        $(".aguan").find("p").remove();
                        // $(".bguan").find("p").remove();
                        // if (result.yuyue){
                            if(result.explain == 1){
                                if(result.yuyue == ""){
                                    return ;
                                }
                                if(result.yuyue == "0"){
                                    alert(result.venue+"上午的预约人数已满");
                                    return ;
                                }
                                if(result.yuyue == "1"){
                                    alert(result.venue+"下午的预约人数已满");
                                    return ;
                                }
                                if(result.yuyue == "0,1"){
                                    alert(result.venue+"当日预约人数已满");
                                    return ;
                                }
                            }else{
                                var arr=JSON.stringify(result.yuyue);
                                var cc=JSON.parse(arr);
                                $.each(result.visit,function(i,val){
                                    if($.inArray( i, cc )==-1){
                                        $(".aguan").append(
                                            '<p href="javascript:;" onclick="setValue()" >' +
                                            val+ "</p>")
                                    }else{
                                        $(".aguan").append(
                                            '<p href="javascript:;" class="booked" onclick="setValue()" >' +
                                            val+ "</p>")
                                    }
                                });
                            }

                            // if(result.yuyueb){
                            //     $(".bguan").css("display","block");
                            //     $(".bguan").append(
                            //         ' <input class="time1" name="time1" type="hidden">');
                            //     var arr1=JSON.stringify(result.yuyueb);
                            //     var cc1=JSON.parse(arr1);
                            //     $.each(result.visit,function(i,val){
                            //         if($.inArray( i, cc1 )==-1){
                            //             $(".bguan").append(
                            //                 '<p href="javascript:;" onclick="setValue1()" >' +
                            //                 val+ "</p>")
                            //         }else{
                            //             $(".bguan").append(
                            //                 '<p href="javascript:;" class="booked"  onclick="setValue1()" >' +
                            //                 val+ "</p>")
                            //         }
                            //     })
                            // }
                        // }
                    },
                    error: function(result){
                        // alert("21321");
                    },
                });
                // });
                // alert(value); //得到日期生成的值，如：2017-08-18
                // alert(endDate); //得结束的日期时间对象，开启范围选择（range: true）才会返回。对象成员同上。
            },
            max : 30
        });
    });
    layui.use('laydate', function(){
        var laydate = layui.laydate;
        //执行一个laydate实例
        laydate.render({
            elem: '#dateBox1', //指定元素
            ready: function() {
                $(".layui-laydate-content table tr td:nth-child(2)").addClass('laydate-disabled')
                $.ajax({
                    type: 'GET',
                    url: '/getDate',
                    success: function (result) {
                        var conNotV = result.conNotView;
                        var conV = result.canVIew;
                        var dataEm = $(".layui-laydate-content table tr td");
                        $.each(dataEm,function(key,item){
                            if(!($.inArray(item.getAttribute('lay-ymd'), conV) == -1)){
                                item.setAttribute('class','');
                            }
                            if(!($.inArray(item.getAttribute('lay-ymd'), conNotV) == -1)){
                                item.setAttribute('class','laydate-disabled');
                            }
                        })
                    },
                    error: function(result){
                    },
                });
                if($(".explain1").val() ==1 ){
                    $(".layui-laydate-content table tr td:nth-child(1)").addClass('laydate-disabled')
                    $(".layui-laydate-content table tr td:nth-child(7)").addClass('laydate-disabled')
                }
            },
            change: function() {
                $(".layui-laydate-content table tr td:nth-child(2)").addClass('laydate-disabled')
                if($(".explain1").val() ==1 ){
                    $(".layui-laydate-content table tr td:nth-child(7)").addClass('laydate-disabled')
                    $(".layui-laydate-content table tr td:nth-child(1)").addClass('laydate-disabled')
                }
            },
            done: function(value, date, endDate){
                $(".bday").val(value);
                var venue =  $(".select_venue .on").attr("data-v");
                var day = $(".cday").val();
                // alert($(".bday").val());
                var day1 = $(".bday").val();
                $.ajax({
                    type: 'POST',
                    url: 'runimformation',
                    data: {"day":day,"venue":venue,"day1":day1,'explain':$(".explain1").val()},
                    dataType:'json',
                    success: function (result) {
                        $(".bguan").find("p").remove();
                        // if (result.yuyue){
                            if(result.explain == 1){
                                if(result.yuyueb){
                                    if(result.yuyueb == ""){
                                        // return ;
                                    }
                                    if(result.yuyueb == "0"){
                                        alert(result.venue1+"上午的预约人数已满");
                                        // return ;
                                    }
                                    if(result.yuyueb == "1"){
                                        alert(result.venue1+"下午的预约人数已满");
                                        // return ;
                                    }
                                    if(result.yuyueb == "0,1"){
                                        alert(result.venue1+"当日预约人数已满");
                                        // return ;
                                    }
                                }
                            }else{
                                if(result.yuyueb){
                                    $(".bguan").css("display","block");
                                    $(".bguan").append(
                                        ' <input class="time1" name="time1" type="hidden">');
                                    var arr1=JSON.stringify(result.yuyueb);
                                    var cc1=JSON.parse(arr1);
                                    $.each(result.visit,function(i,val){
                                        if($.inArray( i, cc1 )==-1){
                                            $(".bguan").append(
                                                '<p href="javascript:;" onclick="setValue1()" >' +
                                                val+ "</p>")
                                        }else{
                                            $(".bguan").append(
                                                '<p href="javascript:;" class="booked"  onclick="setValue1()" >' +
                                                val+ "</p>")
                                        }
                                    })
                                }
                            }
                        // }
                    },
                    error: function(result){
                        // alert("21321");
                    },
                });
                // timeday1();
                // alert(value); //得到日期生成的值，如：2017-08-18
            },
            max : 30
        });
    });

    function setValue() {
        $('.choose_time .aguan').on("click","p",function(){
            if($(this).hasClass('booked') || $(this).hasClass('booked1')){
                return false;
            }
            var time =  $(this).text();
            $(this).addClass('select').siblings().removeClass('select');
            $("#between_time").val(time);
        })
    }
    function setValue1() {
        $('.choose_time .bguan').on("click","p",function(){
            if($(this).hasClass('booked') || $(this).hasClass('booked1')){
                return false;
            }
            var time =  $(this).text();
            $(this).addClass('select').siblings().removeClass('select');
            $(".time1").val(time);
        })
    }

    $('.venue').click(function(){
        $(this).addClass('on').siblings('.venue').removeClass('on');
        $(this).find('img').attr('src','/static/pc/img/button.png');
        $(this).siblings('.venue').find('img').attr('src','/static/pc/img/button1.png');
        var checkValue = $(this).attr("data-v");
        $('input.guan').val(checkValue);
        if(checkValue =='C'){
            $(".bguan").show();
            $('.guan').show();
        }else{
            $(".bguan").hide()
            $('.guan').hide();
        }
    })



    /**
     * 馆项点击ajax循环添加
     * **/
    $('.select_venue a').click(function(){
        var checkValue = $(this).attr("data-v");
        var day = $(".cday").val();
        var day1 = $(".bday").val();
        $.ajax({
            type: 'POST',
            url: 'runimformation',
            data: {"day":day,"venue":checkValue,"day1":day1,'explain':$(".explain1").val()},
            dataType:'json',
            success: function (result) {
                $(".aguan").find("p").remove();
                $(".bguan").find("p").remove();
                // if (result.yuyue){
                    if(result.explain == 1){
                        if(result.yuyueb){
                            if(result.yuyueb == ""){
                                // return ;
                            }
                            if(result.yuyueb == "0"){
                                alert(result.venue1+"上午的预约人数已满");
                                // return ;
                            }
                            if(result.yuyueb == "1"){
                                alert(result.venue1+"下午的预约人数已满");
                                // return ;
                            }
                            if(result.yuyueb == "0,1"){
                                alert(result.venue1+"当日预约人数已满");
                                // return ;
                            }
                        }
                        if(result.yuyue == ""){
                            return ;
                        }
                        if(result.yuyue == "0"){
                            alert(result.venue+"上午的预约人数已满");
                            return ;
                        }
                        if(result.yuyue == "1"){
                            alert(result.venue+"下午的预约人数已满");
                            return ;
                        }
                        if(result.yuyue == "0,1"){
                            alert(result.venue+"当日预约人数已满");
                            return ;
                        }
                    }else{
                        var arr=JSON.stringify(result.yuyue);
                        var cc=JSON.parse(arr);
                        $.each(result.visit,function(i,val){
                            if($.inArray( i, cc )==-1){
                                $(".aguan").append(
                                    '<p href="javascript:;" onclick="setValue()" >' +
                                    val+ "</p>")
                            }else{
                                $(".aguan").append(
                                    '<p href="javascript:;" class="booked" onclick="setValue()" >' +
                                    val+ "</p>")
                            }
                        });
                        if(result.yuyueb){
                            $(".bguan").css("display","block");
                            $(".bguan").append(
                                ' <input class="time1" name="time1" type="hidden">');
                            var arr1=JSON.stringify(result.yuyueb);
                            var cc1=JSON.parse(arr1);
                            $.each(result.visit,function(i,val){
                                if($.inArray( i, cc1 )==-1){
                                    $(".bguan").append(
                                        '<p href="javascript:;" onclick="setValue1()" >' +
                                        val+ "</p>")
                                }else{
                                    $(".bguan").append(
                                        '<p href="javascript:;" class="booked"  onclick="setValue1()" >' +
                                        val+ "</p>")
                                }
                            })
                        }
                    }
                // }
            },
            error: function(result){
                alert("错误");
            },
        });
    });

</script>

</body>
</html>